// InputTextView
// author Jacky
// options:
// | --- | --- |
// | options | description |
// | textType | 输入文本类型，包括text, number, password, email, date, time, week... |
// | placeholder | 提示文本 |

define(['./BaseView'], function(BaseView){
    //var _this = null;
    return BaseView.extend({
        type: 'InputTextView',
        defaults: {
            type: 'InputTextView',
            label: '主题',
            placeholder: '请输入主题',
            required: true,
            maxlength : 10,
            layout: 'vertical',
            inspectorTextType: 'border'
        },

        inputText: null,
        inputLabel: null,

        initialize: function() {
            //_this = this;

        },

        render: function(){
            this.$el.empty();
            this.inputText = $('<input />');
            this.inputLabel = $('<label></label>');

            var _this = this;
            if(!this.options){
                return;
            }

            var $rootView = $('<div class="input-text-view"></div>');

            if (this.options.label) {
                this.inputLabel.text(this.options.label);
                $rootView.append(this.inputLabel);
            }

            this.inputText.attr('name', this.options.key || "");
            this.inputText.attr('placeholder', this.options.placeholder || "");
            this.inputText.attr('type', this.options.textType || "text");
            this.inputText.attr('maxlength', this.options.maxlength);

            if(this.options.layout != "vertical"){
                // 水平布局的表单
                $rootView.addClass('label-inline');
            } else if(this.options.layout == "vertical"){
                // 垂直布局的表单
                $rootView.addClass('label-block');
            }

            if(!this.options.label){
                // 无label的表单
                $rootView.addClass('label-none');
            }

            $rootView.append(this.inputText);
            this.$el.append($rootView);

            var curModel = this.getModel();
            var text = curModel && this.options.key ? curModel.get(this.options.key) : "";
            this.inputText.val(text);

            this.inputText.focus(function(e) {
                _this.inputText.removeClass("input-warning");
                _this.inputText.addClass("input-focus");
            });

            this.inputText.blur(function(e) {
                _this.inputText.removeClass('input-warning');
                _this.inputText.removeClass('input-focus');
            });

            var text = curModel && this.options.key ? curModel.get(this.options.key) : '';

            this.setValue(text);

            return this;
        },

        setWarning: function() {
            this.inputText.addClass('input-warning');
            this.inputText.focus();
        },

        getValue:function(){
            return this.inputText.val();
        },

        setValue:function(value){
            this.inputText.val(value);
        },

        onDataBind: function() {
            this.render();
        },
    });
});
